<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('村民信息列表')" />
    <style>
        label {margin: 0 5px;}
    </style>
</head>
<body class="gray-bg">
     <div class="container-div">
        <div class="row">
            <div class="col-md-12 search-collapse">
                <p class="select-title" th:if="${villageId != null}" th:text="${dept.deptName} + 居民信息录入"></p>
                <div class="select-list">
                    <p>
                        <label th:text="录入数据："></label>
                        <a th:text="下载表格" th:href="@{/common/download?fileName=%E5%9F%BA%E7%A1%80%E4%BF%A1%E6%81%AF%E5%BD%95%E5%85%A5.xls}" class="btn btn-success btn-sm" download />
                        <button th:text="上传表格" type="button" id="contentFileUpload" class="btn btn-success btn-sm"/>
                        <input type="hidden" name="contentFile" id="contentFile"/>
                        <a th:text="录入居民信息" class="btn btn-warning btn-sm" onclick="$.operate.addFull()" />
                    </p>
                    <p>
                        <label th:text="本村常住人口户数："/>
                        <label>
                            <input type="number" class="form-control input-sm number" name="residents" min="0" th:value="${village==null} ? '' : ${village.residents}">
                        </label>
                        <label>
                            <a class="btn btn-warning btn-sm" onclick="updateResidents();" th:text="确认"/>
                        </label>
                    </p>

                    <p>
                        <label th:text="本村共有 + ${alarmCount} + 户没有安装一氧化碳报警器">
                        </label>
                        <label th:if="${alarmCount > 0}">
                            <a style="color:red" th:if="${villageId != null}" th:text="查看详情" th:onclick="|$.modal.openWindow('未安装一氧化碳报警器','clientUser/detail?page=alarm&villageId=${villageId}');|"/>
                            <a style="color:red" th:unless="${villageId != null}" th:text="查看详情" th:onclick="|$.modal.openWindow('未安装一氧化碳报警器','clientUser/detail?page=alarm');|"/>
                        </label>
                        <label style="margin:0 10px;" th:text="本村共有 + ${noteCount} + 户发放明白纸"></label>
                        <label th:if="${noteCount > 0}">
                            <a style="color:red" th:if="${villageId != null}" th:text="查看详情" th:onclick="|$.modal.openWindow('未发放明白纸','clientUser/detail?page=note&villageId=${villageId}');|"></a>
                            <a style="color:red" th:unless="${villageId != null}" th:text="查看详情" th:onclick="|$.modal.openWindow('未发放明白纸','clientUser/detail?page=note');|"></a>
                        </label>
                    </p>
                </div>
            </div>

            <div class="col-sm-12 select-table table-bordered">
                <form id="formId">
                    <div class="select-list">
                        <p>
                            <label>
                                <a class="btn btn-success btn-sm" style="background-color: #7a5674;border-color: #7a5674;"
                                   onclick="$.table.exportExcel()">
                                    <i th:text="导出表格" class="fa fa-download"></i>
                                </a>
                            </label>
                            <label th:text="总购洁净煤：+ ${cunTotalOrder} + 吨"></label>
                        </p>
                    </div>
                </form>
                <table id="bootstrap-table"></table>
            </div>
        </div>
    </div>
    <th:block th:include="include :: footer" />
    <script th:inline="javascript">
        var villageId = [[${villageId} == null ? '' : ${villageId}]];
        var keepwarmTypeDatas = [[${@dict.getType('keep_warm_type')}]];
        var stoveDatas = [[${@dict.getType('yes_or_no')}]];
        var mediaDatas = [[${@dict.getType('yes_or_no')}]];
        var noteDatas = [[${@dict.getType('yes_or_no')}]];
        var areaDatas = [[${@dict.getType('keep_warn_area')}]];
        var prefix = ctx + "jjm/clientUser";
        var createUrl = prefix + "/add";
        if(villageId){
            createUrl = createUrl+"?villageId="+villageId;
        }

        function openDetail(page){
            $.modal.open('详情',prefix + '/detail?page=' + page);
        }

        function updateResidents() {
            var inputResidents = $('input[name="residents"]').val();
            var params = { residents : inputResidents };
            if(villageId){
                params['id'] = villageId;
            }
            $.ajax({
                type : "post",
                contentType: "application/json;charset=UTF-8",
                url : prefix + "/updateResidents",
                dataType:'json',
                data : JSON.stringify(params),
                before: function () {
                    $.modal.loading("正在处理，请稍后...");
                },
                success : function(result) {
                    $.modal.closeLoading();
                    if (result.code == web_status.SUCCESS) {
                        $.modal.msgSuccess(result.msg);
                        $.table.refresh();
                    } else{
                        $.modal.enable();
                        $.modal.alertWarning(result.msg)
                    }
                },
                //请求失败，包含具体的错误信息
                error : function(e){
                    $.modal.closeLoading();
                    $.modal.alertError("保存失败，请重试");
                }
            });
        }

        function downloadQrcodeZip(){
            if(villageId){
                window.location.href = prefix + "/exportQrcodeZip?villageId=" + villageId;
            } else {
                window.location.href = prefix + "/exportQrcodeZip";
            }
        }

        layui.use('upload', function(){
            var upload = layui.upload;
            //执行实例
            var uploadInst = upload.render({
                elem: '#contentFileUpload' //绑定元素
                ,url: prefix + '/file/upload?villageId='+villageId //上传接口
                ,multiple: true
                ,accept: 'file'
                ,beforeSend: function () {
                    $.modal.loading("正在处理中，请稍后...");
                    $.modal.disable();
                }
                ,done: function(result){
                    if(result.code == 0){
                        $.modal.msgSuccess('上传成功');
                        $.table.refresh();
                    }else{
                        $.modal.alertError(result.msg);
                    }
                    $.modal.closeLoading();
                }
                ,error: function(err){
                    $.modal.alertError('上传失败，请重试');
                    $.modal.closeLoading();
                }
            });
        });




        $(function() {

            var options = {
                url : prefix + "/listVillage",
                exportUrl: prefix + "/exportVillage",
                createUrl: createUrl,
                modalName: [[${dept.deptName}]]+"辖区内信息",
                showSearch: false,
                showRefresh: false,
                showToggle: false,
                showColumns: false,
                columns:[
                    [{
                        field: 'villageId',
                        title: '编号',
                        rowspan : 2,
                        align: "center",
                        valign: "middle"
                    }, {
                        field: 'name',
                        title: '村',
                        rowspan : 2,
                        align: "center",
                        valign: "middle"
                    }, {
                        field: 'population',
                        title: titleValue('精准确村<br>确户总户数'),
                        rowspan : 2,
                        align: "center",
                        valign: "middle"
                    }, {
                        field: 'residents',
                        title: titleValue('常住人<br>口户数'),
                        rowspan : 2,
                        align: "center",
                        valign: "middle"
                    }, {
                        field: 'jjm',
                        title: titleValue('洁净取<br>暖户数'),
                        rowspan : 2,
                        align: "center",
                        valign: "middle"
                    }, {
                        field: 'notjjm',
                        title: titleValue('洁净煤<br>未入户数'),
                        rowspan : 2,
                        align: "center",
                        valign: "middle"
                    }, {
                        field: 'others',
                        title: titleValue('采用其他方<br>式取暖户数'),
                        rowspan : 2,
                        align: "center",
                        valign: "middle"
                    }, {
                        field: 'buqu',
                        title: titleValue('冬季不<br>取暖户数'),
                        rowspan : 2,
                        align: "center",
                        valign: "middle"
                    },{
                        field: 'swz',
                        title: titleValue('生物质<br>取暖户数'),
                        rowspan : 2,
                        align: "center",
                        valign: "middle"
                    }, {
                        field: '',
                        title: '村',
                        align: 'center',
                        colspan : 2,
                        valign: "middle"
                    },{
                        field: 'orderAmount',
                        title: titleValue('总购洁<br>净煤数(吨)'),
                        rowspan : 2,
                        align: "center",
                        valign: "middle"
                    },{
                        title: '操作',
                        align: 'center',
                        rowspan : 2,
                        valign: "middle",
                        formatter: function(value, row, index) {
                            var actions = [];
                            actions.push('<a class="btn btn-success btn-xs" href="javascript:void(0)" onclick="$.modal.openTab(\''+row.name+'居民信息详情\',\'/jjm/clientUser?villageId=' + row.villageId + '\')"><i class="fa fa-shower"></i>查看详情</a> ');
                            return actions.join('');
                        }
                    }],[
                        {
                            field: 'baolianrenCount',
                            title: titleValue('村级包<br>联人数'),
                            rowspan : 1,
                            align: "center",
                            valign: "middle"
                        }, {
                            field: 'baolianhuCount',
                            title: titleValue('包联<br>户数'),
                            width: 80,
                            valign: "middle"
                        }
                    ]]
            };
            $.table.init(options);
        });
    </script>
</body>
</html>